<!--
 * @Author: 李兵 964368540@qq.com
 * @Date: 2024-11-11 15:21:33
 * @LastEditors: libing 9852442+liu-sheng-8667@user.noreply.gitee.com
 * @LastEditTime: 2024-12-03 09:55:46
 * @FilePath: \crm\pagesform\form\add-address-form.vue
 * @Description: 新增发货地址
-->
<template>
	<view class="form-wrap">
		<uni-forms ref="baseForm" :modelValue="formData" :rules="rules" label-position="left" label-width="100px">
			<view class="forms-item-wrap">
				<uni-forms-item label="联系人" name="name" :required="true">
					<input type="text" trim="all" v-model="formData.name" placeholder="请输入联系人" :inputBorder="false"
						placeholder-class="placeholder_class" />
				</uni-forms-item>
				<uni-forms-item label="手机号" name="phone" :required="true">
					<input type="number" trim="all" :maxlength="11" v-model="formData.phone" placeholder="请输入手机号"
						:inputBorder="false" placeholder-class="placeholder_class" />
				</uni-forms-item>
				<uni-forms-item label="地址" name="detailAddress">
					<view class="custom-wrap" @click="chooseAddressAuth">
						<view style="
                flex: 1;
                line-height: 50rpx !important;
                display: flex;
                align-items: center;
              " :class="[
                formData.detailAddress ? 'uni-input-input' : 'select-wrap',
              ]">{{
                formData.detailAddress ? formData.detailAddress : "请选择地址"
              }}</view>
						<uni-icons type="right" size="20" class="right-arrow" color="#171A1D"
							v-if="!formData.detailAddress"></uni-icons>
					</view>
				</uni-forms-item>
				<uni-forms-item label="备注" name="building" :required="true">
					<input type="text" trim="all" v-model="formData.building" placeholder="请输入门牌号等" :inputBorder="false"
						placeholder-class="placeholder_class" />
				</uni-forms-item>
			</view>
		</uni-forms>
		<bottombox>
			<u-button type="error" :text="formData.id?'修改':'新增'" @click="onSumbit" :loading="loading"
				:disabled="loading"></u-button>
		</bottombox>
	</view>
</template>
<script>
	import {
		addAddress,
		updateAddress
	} from "@/apis/order/index";
	import {
		getUserInfo
	} from "@/config/storage";
	export default {
		name: "add-address-form",
		onLoad(data) {
			this.customId = data.customId;
			if (data.item) {
				let item = JSON.parse(data.item)
				this.formData.name = item.name;
				this.formData.phone = item.phone;
				this.formData.detailAddress = item.detailAddress;
				this.formData.latitude = item.latitude;
				this.formData.longitude = item.longitude;
				this.formData.building = item.building;
				this.formData.id = item.id;
			}
		},
		data() {
			return {
				loading: false,
				customId: null,
				formData: {
					name: null,
					phone: null,
					detailAddress: null,
					latitude: null,
					longitude: null,
					building: null
				},
				modalInfo: {
					content: "为了您更好的体验小程序的功能，需要获取位置信息，请点击设置开启定位权限",
					confirmText: "设置",
				},
				rules: {
					name: {
						rules: [{
							required: true,
							errorMessage: "请输入联系人",
						}, ],
					},
					phone: {
						rules: [{
								required: true,
								errorMessage: "请输入手机号",
							},
							{
								minLength: 11,
								maxLength: 11,
								errorMessage: "请输入正确的手机号"
							},
						],
					},
					detailAddress: {
						rules: [{
							required: true,
							errorMessage: "请选择地址",
						}, ],
					},
					building: {
						rules: [{
							required: true,
							errorMessage: "请输入门牌号等",
						}, ],
					}
				},
			};
		},
		methods: {
			getSetting() {
				return new Promise((resolve, reject) => {
					uni.getSetting({
						success: (res) => {
							if (res.authSetting["scope.userLocation"] === undefined) {
								resolve(0);
								return;
							}
							if (res.authSetting["scope.userLocation"]) {
								resolve(1);
							} else {
								resolve(2);
							}
						},
					});
				});
			},
			// 获取位置授权
			async chooseAddressAuth() {
				const status = await this.getSetting();
				if (status === 2) {
					this.rejectOpenModle();
					return;
				}
				this.getAddress();
			},
			// 拒绝后弹框
			rejectOpenModle() {
				uni.showModal({
					content: this.modalInfo.content,
					confirmText: this.modalInfo.confirmText,
					showCancel: true,
					success: (res) => {
						if (res.confirm) {
							this.openSetting();
						}
					},
				});
			},
			openSetting() {
				uni.openSetting({
					success: (res) => {
						if (res.authSetting && res.authSetting["scope.userLocation"]) {
							this.getAddress();
						}
					},
					fail: (err) => {},
				});
			},
			// 获取地址
			getAddress() {
				wx.chooseLocation({
					success: (res) => {
						this.formData = {
							...this.formData,
							latitude: res.latitude,
							longitude: res.longitude,
							address: res.address,
							detailAddress: res.address + res.name,
						};
					},
				});
			},
			// 新增收货地址
			async onSumbit() {
				try {
					const valid = await this.$refs.baseForm.validate();
					if (valid) {
						this.loading = true;
						const userInfo = getUserInfo();
						const body = {
							customId: this.customId,
							...this.formData,
						};
						let api = this.formData.id ? updateAddress : addAddress
						const res = await api(body);
						this.loading = false;
						uni.navigateBack({
							delta: 1, // delta值为1时表示返回上一级页面
						});
					}
				} catch {
					this.loading = false;
				}
			},
		},
	};
</script>
<style lang="scss" scoped>
	page {
		background: #f2f4f5;
	}

	.upstairsType {
		color: #c1c5c9;
		font-size: 15px;
		line-height: 99rpx !important;
		height: 99rpx !important;
	}

	.custom-wrap {
		display: flex;
		align-items: center;
	}
</style>